<template>
	<div id="financialAudit">
		<navAndBanner></navAndBanner>	
		<div class="img1">

		</div>
		<div style="height:1px;border-top:3px solid #7ecef4;width:76.4%;margin:0 auto;"></div>
		
		<div class="info">
			<div class="info1" style="margin-left: 5vw"><span class="info3">酒&nbsp卡&nbsp号</span><span class="info2">{{wshJiuKaInfo.CJKH}}</span></div>
			<div class="info1"><span class="info3">存酒日期</span><span class="info2">{{wshJiuKaInfo.LRSJ}}</span></div> 

			<div class="info1"><span class="info3">状&nbsp&nbsp&nbsp态</span><span class="info2">{{wshJiuKaInfo.STATE}}</span></div>
		</div>
		<div class="info">
			<div class="info1" style="margin-left: 5vw"><span class="info3">客户姓名</span><span class="info2">{{wshJiuKaInfo.KHMC}}</span></div>
			<div class="info1"><span class="info3">联系电话</span><span class="info2">{{wshJiuKaInfo.KHDH}}</span></div> 

			<div class="info1"><span class="info3">会员号</span><span class="info2">{{wshJiuKaInfo.KHBM}}</span></div>
		</div>
		<div class="info">
			<div style="margin-left: 5vw"><span class="info3">备&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp注</span><div style="width: 61.3vw;height: 100px;background-color: #eeeeee;display: inline-block;margin-left: 23px;border-radius: 15px;padding:12px">{{wshJiuKaInfo.BZ}}</div></div>
		</div>
		
		<div style="width:69.2vw;margin:0 auto;margin-top:25px">
			<Table border :columns="columns4" :data="wshJiuKaInfo.list"></Table>
			<div style="margin:0 auto;width:50vw;margin-top:30px" >
				<button class="btn" @click="pass">审核酒卡</button>
				<button class="btn" style="background:#dcdcdc" @click="cancel">作废酒卡</button>
				<button class="btn">打印酒卡</button>
			</div>
			
		</div>
		
		<div class="footer">
			<p>kqmts   &copy 2015-2017 All Rights Reserved</p>
			<p>川ICP备16020686号</p>
		</div>
		 <Modal title="对话框标题" v-model="fail" class-name="vertical-center-modal">
        			<p style="text-align:center;font-size:24px">操作失败</p>
        			
    	 </Modal>
	</div>
</template>
<script>
	import navAndBanner from '../navAndBanner.vue'
	export default {
		components:{
			navAndBanner
		},
		data(){
			return{
				columns4: [

				{
					title: '序列',
					key: 'XH'
				},
				{
					title: '商品编码',
					key: 'SPBM'
				},
				{
					title: '商品名称',
					key: 'SPMC'
				},
				{
					title: '单位',
					key: 'JLDW'
				},
				{
					title: '数量',
					key: 'SL'
				},
				{
					title: '库存',
					key: 'CGSL'
				},
				{
					title: '存期',
					key: 'address'
				},
				{
					title: '到期日期',
					key: 'YXQ'
				},
				{
					title: '去源/去向',
					key: 'address'
				}
				],
				wshJiuKaInfo:{},
				CJKH:"",
				fail:false
			}
		},
		mounted(){
			
			this.userinfo = JSON.parse(sessionStorage.userinfo).data;
			this.wshJiuKaInfo = JSON.parse(sessionStorage.wshJiuKaInfo)
			console.log("wshJiuKaInfo",this.wshJiuKaInfo)
			var _this = this;
			this.$http.post(`${this.URL}/api/ws/storage_detail`,{
				token:_this.userinfo.token,
				userid:_this.userinfo.YHBM,
				timestamp:new Date().getTime(),
				CJKH:_this.wshJiuKaInfo.CJKH

			})
			.then(function (res) {
				// body...
				if (res.data.error_code ==0) {
					_this.wshJiuKaInfo = res.data.data
					// for (var i = res.data.data.length - 1; i >= 0; i--) {
					// 	if (res.data.data[i].DH.indexOf(_this.wshJiuKaInfo.DH)) {
					// 		_this.wshJiuKaDetail = res.data.data[i]
					// 	}
					// }
					
				}
			})
			
		// 	this.$http.post('${this.URL}/api/ws/storage_detail',{
		// 		token:_this.userinfo.token,
		// 		userid:_this.userinfo.YHBM,
		// 		timestamp:new Date().getTime(),
		// 		CJKH:_this.wshJiuKaInfo.DH
		// 	})
		// 	.then(function(res){
		// 		if (res.data.error_code ==0) {
		// 			_this.jiuMessage = res.data.data
		// 		}
		// 	})
		},
		methods:{
			pass:function(){
				var _this = this
				var data = {
					SYSUSERBM:_this.userinfo.YHBM,
					SYSUSERMC:_this.userinfo.YHMC,
					DH:_this.wshJiuKaInfo.DH,
					CJKH:_this.wshJiuKaInfo.CJKH
				}
				data = JSON.stringify(data)
				this.$http.post(`${this.URL}/api/ws/cjd_auditing`,{
					token:_this.userinfo.token,
					userid:_this.userinfo.YHBM,
					timestamp:new Date().getTime(),
					data:data
				})
				.then(function(res){
					if (res.data.error_code ==0) {
						_this.$router.push("/cunjiuFunc/financialAudit")
					}
					else{
						_this.fail = true
					}
				})
			},
			cancel:function(){
				var _this = this;
				this.$http.post(`${this.URL}//api/ws/cancel_cjd`,{
					token:_this.userinfo.token,
					userid:_this.userinfo.YHBM,
					timestamp:new Date().getTime(),
					DH:_this.wshJiuKaInfo.DH,
					CJKH:_this.wshJiuKaInfo.CJKH
				})
				.then(function(res){
					if (res.data.error_code ==0) {
						this.$router.push("/cunjiuFunc/financialAudit")
					}
					else{
						_this.fail = true
					}
				})
				
			}
		}
	}
</script>
<style scoped>
	.btn{
		width: 7.8vw;height: 50px;border-radius: 5px;border:none;outline: none;background-color: #7ecef4;color: white;font-size: 20px;margin-left: 5vw;cursor:pointer;
	}
	.title{
		width: 965px;
		height: 45px;
		border-bottom: 1px solid;
		margin: 0 auto;
		margin-top: 70px
	}
	.img1{
		background: url(../../assets/img/Title4.png);
		width: 438px;
		height: 69px;
		margin:0 auto;
		margin-top: 90px;margin-bottom: 80px;
	}
	.navAndBanner{
		background:linear-gradient(30deg,#b490ca,#5ebbe7);
		width: 100%;
		height: 120px;
		vertical-align: middle;
		padding-top: 40px
		
	}
	a{
		text-decoration: none;
	}
	nav ul li{
		display: inline-block;
		vertical-align: middle;
		margin-right: 5%
	}
	nav ul li a{
		font-size: 24px;
		color: #999999;
	}
	nav ul li:first-child{
		margin-left: 13%;
		margin-right: 15%;
	}
	nav ul li:last-child{
		margin-top: 12px;
		float: right
		
	}
	body{background-color: #1E1E1E}
	*{padding:0;margin: 0;list-style:none;font-family: "微软雅黑";}
	.footer{
		height: 125px;
		width: 100%;
		background:linear-gradient(30deg,#b490ca,#5ebbe7);
		text-align: center;
		vertical-align: middle;
		color: white;
		padding-top: 50px;
		margin-top: 125px
	}
	.info2{
		width: 14.5vw;
		height: 50px;
		background-color: #eeeeee;
		display: inline-block;
		border-radius: 15px;
		margin-left: 23px;
		padding: 12px
	}
	.info1{
		width: 20.8vw;
		display: inline-block;
		flex: 1;
		height: 50px;
	}
	.info{
		width: 76.4vw;
		
		margin: 0 auto;
		padding: 35px 0px;
		font-size: 20.5px;
		display: flex;

	}
</style>